<!DOCTYPE html>
<!--[if IE 9]> <html lang="en" class="ie9"> <![endif]-->
<!--[if gt IE 9]> <html lang="en" class="ie"> <![endif]-->
<!--[if !IE]><!-->
<html dir="ltr" lang="en">
	<!--<![endif]-->

	<head>
		<meta charset="utf-8">
		<title>The Project | Home One Page</title>
		<meta name="description" content="The Project a Bootstrap-based, Responsive HTML5 Template">
		<meta name="author" content="htmlcoder.me">

		<!-- Mobile Meta -->
		<meta name="viewport" content="width=device-width, initial-scale=1.0">

		<!-- Favicon -->
		<link rel="shortcut icon" href="images/favicon.ico">

		<!-- Web Fonts -->
		<link href='http://fonts.googleapis.com/css?family=Roboto:400,300,300italic,400italic,500,500italic,700,700italic' rel='stylesheet' type='text/css'>
		<link href='http://fonts.googleapis.com/css?family=Raleway:700,400,300' rel='stylesheet' type='text/css'>
		<link href='http://fonts.googleapis.com/css?family=Pacifico' rel='stylesheet' type='text/css'>
		<link href='http://fonts.googleapis.com/css?family=PT+Serif' rel='stylesheet' type='text/css'>

		<!-- Bootstrap core CSS -->
		<link href="bootstrap/css/bootstrap.css" rel="stylesheet">

		<!-- Font Awesome CSS -->
		<link href="fonts/font-awesome/css/font-awesome.css" rel="stylesheet">

		<!-- Fontello CSS -->
		<link href="fonts/fontello/css/fontello.css" rel="stylesheet">

		<!-- Plugins -->
		<link href="plugins/magnific-popup/magnific-popup.css" rel="stylesheet">
		<link href="plugins/rs-plugin-5/css/settings.css" rel="stylesheet">
		<link href="plugins/rs-plugin-5/css/layers.css" rel="stylesheet">
		<link href="plugins/rs-plugin-5/css/navigation.css" rel="stylesheet">
		<link href="css/animations.css" rel="stylesheet">
		<link href="plugins/owlcarousel2/assets/owl.carousel.min.css" rel="stylesheet">
		<link href="plugins/owlcarousel2/assets/owl.theme.default.min.css" rel="stylesheet">
		<link href="plugins/hover/hover-min.css" rel="stylesheet">		
		<link href="plugins/morphext/morphext.css" rel="stylesheet">
		
		<!-- The Project's core CSS file -->
		<!-- Use css/rtl_style.css for RTL version -->
		<link href="css/style.css" rel="stylesheet" >
		<!-- The Project's Typography CSS file, includes used fonts -->
		<!-- Used font for body: Roboto -->
		<!-- Used font for headings: Raleway -->
		<!-- Use css/rtl_typography-default.css for RTL version -->
		<link href="css/typography-default.css" rel="stylesheet" >
		<!-- Color Scheme (In order to change the color scheme, replace the blue.css with the color scheme that you prefer)-->
		<link href="css/skins/light_blue.css" rel="stylesheet">
		

		<!-- Custom css --> 
		<link href="css/custom.css" rel="stylesheet">
	</head>

	<!-- body classes:  -->
	<!-- "boxed": boxed layout mode e.g. <body class="boxed"> -->
	<!-- "pattern-1 ... pattern-9": background patterns for boxed layout mode e.g. <body class="boxed pattern-1"> -->
	<!-- "transparent-header": makes the header transparent and pulls the banner to top -->
	<!-- "gradient-background-header": applies gradient background to header -->
	<!-- "page-loader-1 ... page-loader-6": add a page loader to the page (more info @components-page-loaders.html) -->
	<body class="no-trans front-page transparent-header  ">

		<!-- scrollToTop -->
		<!-- ================ -->
		<div class="scrollToTop circle"><i class="icon-up-open-big"></i></div>
		
		<!-- page wrapper start -->
		<!-- ================ -->
		<div class="page-wrapper">
		
			<!-- header-container start -->
			<div class="header-container">
				<!-- header start -->
				<!-- classes:  -->
				<!-- "fixed": enables fixed navigation mode (sticky menu) e.g. class="header fixed clearfix" -->
				<!-- "dark": dark version of header e.g. class="header dark clearfix" -->
				<!-- "full-width": mandatory class for the full-width menu layout -->
				<!-- "centered": mandatory class for the centered logo layout -->
				<!-- ================ --> 
				<header class="header  fixed    clearfix">
					
					<div class="container">
						<div class="row">
							<div class="col-md-3 ">
								<!-- header-first start -->
								<!-- ================ -->
								<div class="header-first clearfix">

									<!-- logo -->
									<div id="logo" class="logo">
										<a href="index.html"><img id="logo_img" src="images/logo_light_blue.png" alt="The Project"></a>
									</div>

									<!-- name-and-slogan -->
									<div class="site-slogan">
										Multipurpose HTML5 Template
									</div>
									
								</div>
								<!-- header-first end -->

							</div>
							<div class="col-md-9">
					
								<!-- header-second start -->
								<!-- ================ -->
								<div class="header-second clearfix">
									<!-- main-navigation start -->
									<!-- classes: -->
									<!-- "onclick": Makes the dropdowns open on click, this the default bootstrap behavior e.g. class="main-navigation onclick" -->
									<!-- "animated": Enables animations on dropdowns opening e.g. class="main-navigation animated" -->
									<!-- "with-dropdown-buttons": Mandatory class that adds extra space, to the main navigation, for the search and cart dropdowns -->
									<!-- ================ -->
									<div class="main-navigation animated">

										<!-- navbar start -->
										<!-- ================ -->
										<nav class="navbar navbar-default" role="navigation">
											<div class="container-fluid">

												<!-- Toggle get grouped for better mobile display -->
												<div class="navbar-header">
													<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse-1">
														<span class="sr-only">Toggle navigation</span>
														<span class="icon-bar"></span>
														<span class="icon-bar"></span>
														<span class="icon-bar"></span>
													</button>
												</div>

												<!-- Collect the nav links, forms, and other content for toggling -->
												<div class="collapse navbar-collapse scrollspy smooth-scroll" id="navbar-collapse-1">
													<ul class="nav navbar-nav navbar-right">
														<li class="dropdown active">
															<a href="#banner" class="dropdown-toggle" data-toggle="dropdown">Home</a>
															<ul class="dropdown-menu">
																<li><a href="index.html">Home - Default</a></li>
															</ul>
														</li>
														<li><a href="#about">About</a></li>
														<li><a href="#services">Services</a></li>
														<li><a href="#portfolio">Portfolio</a></li>
														<li><a href="#footer">Contact</a></li>
													</ul>
												</div>

											</div>
										</nav>
										<!-- navbar end -->

									</div>
									<!-- main-navigation end -->
								</div>
								<!-- header-second end -->
					
							</div>
						</div>
					</div>
					
				</header>
				<!-- header end -->
			</div>
			<!-- header-container end -->
		
			<!-- banner start -->
			<!-- ================ -->
			<div id="banner" class="banner clearfix">

				<!-- slideshow start -->
				<!-- ================ -->
				<div class="slideshow">

					<!-- slider revolution start -->
					<!-- ================ -->
					<div class="slider-revolution-5-container">
						<div id="slider-banner-fullscreen" class="slider-banner-fullscreen rev_slider" data-version="5.0">
							<ul class="slides">
								<!-- slide 1 start -->
								<!-- ================ -->
								<li class="text-center" data-transition="random" data-slotamount="default" data-masterspeed="default" data-title="Unlimited Options and Layouts">

								<!-- main image -->
								<img src="images/slider-fullscreen-slide-1.jpg" alt="slidebg1" data-bgposition="center center" data-bgrepeat="no-repeat" data-bgfit="cover" class="rev-slidebg">

								<!-- Transparent Background -->
								<div class="tp-caption dark-translucent-bg"
									data-x="center"
									data-y="center"
									data-start="0"
									data-transform_idle="o:1;"
									data-transform_in="o:0;s:600;e:Power2.easeInOut;"
									data-transform_out="o:0;s:600;"
									data-width="5000"
									data-height="5000">
								</div>

								<!-- LAYER NR. 1 -->
								<div class="tp-caption xlarge_white"
									data-x="center"
									data-y="110"
									data-start="1000"
									data-end="2500"
									data-splitin="chars"
									data-splitout="chars"
									data-elementdelay="0.1"
									data-endelementdelay="0.1"
									data-transform_idle="o:1;"
									data-transform_in="x:[50%];o:0;s:600;e:Power4.easeInOut;"
									data-transform_out="x:[-50%];o:0;s:200;e:Power2.easeInOut;"
									data-mask_in="x:0;y:0;s:inherit;e:inherit;"
									data-mask_out="x:inherit;y:inherit;s:inherit;e:inherit;">Inspiration
								</div>

								<!-- LAYER NR. 2 -->
								<div class="tp-caption xlarge_white"
									data-x="center"
									data-y="110"
									data-start="3100"
									data-end="4600"
									data-splitin="chars"
									data-splitout="chars"
									data-elementdelay="0.1"
									data-endelementdelay="0.1"
									data-transform_idle="o:1;"
									data-transform_in="x:[-50%];o:0;s:600;e:Power4.easeInOut;"
									data-transform_out="x:[-50%];o:0;s:200;e:Power2.easeInOut;"
									data-mask_in="x:0;y:0;s:inherit;e:inherit;"
									data-mask_out="x:inherit;y:inherit;s:inherit;e:inherit;">Innovation
								</div>

								<!-- LAYER NR. 3 -->
								<div class="tp-caption xlarge_white"
									data-x="center"
									data-y="110"
									data-start="5200"
									data-end="6700"
									data-splitin="chars"
									data-splitout="chars"
									data-elementdelay="0.1"
									data-endelementdelay="0.1"
									data-transform_idle="o:1;"
									data-transform_in="x:[50%];o:0;s:600;e:Power4.easeInOut;"
									data-transform_out="x:0;y:[-50%];o:0;s:200;e:Power2.easeInOut;"
									data-mask_in="x:0;y:0;s:inherit;e:inherit;"
									data-mask_out="x:inherit;y:inherit;s:inherit;e:inherit;">Success
								</div>

								<!-- LAYER NR. 4 -->
								<div class="tp-caption large_white"
									data-x="center"
									data-y="110"
									data-start="7000"
									data-transform_idle="o:1;"
									data-transform_in="y:[-100%];sX:1;sY:1;o:0;s:1100;e:Power4.easeInOut;"
									data-transform_out="y:0;s:1000;e:Power2.easeInOut;"
									data-mask_in="x:0px;y:[-100%];s:inherit;e:inherit;"
									data-mask_out="x:inherit;y:inherit;s:inherit;e:inherit;"><span class="logo-font">The <span class="text-default">Project</span></span> <br> Powerful Bootstrap Template
								</div> 


								<!-- LAYER NR. 5 -->
								<div class="tp-caption"
									data-x="center"
									data-y="250"
									data-hoffset="-232"
									data-start="1000"
									data-end="6200"
									data-transform_idle="o:1;"
									data-transform_in="x:[50%];y:0;o:0;s:700;e:Power4.easeInOut;"
									data-transform_out="x:0;y:0;o:0;s:700;e:Power2.easeInOut;"><span class="icon large circle"><i class="circle icon-lightbulb"></i></span>
								</div>

								<!-- LAYER NR. 6 -->
								<div class="tp-caption"
									data-x="center"
									data-y="250"
									data-start="3100"
									data-end="6200"
									data-transform_idle="o:1;"
									data-transform_in="x:[-50%];y:0;o:0;s:700;e:Power4.easeInOut;"
									data-transform_out="x:0;y:0;o:0;s:700;e:Power2.easeInOut;"><span class="icon large circle"><i class="circle icon-arrows-ccw"></i></span>
								</div>

								<!-- LAYER NR. 7 -->
								<div class="tp-caption"
									data-x="center"
									data-y="250"
									data-hoffset="232"
									data-start="5200"
									data-end="6200"
									data-transform_idle="o:1;"
									data-transform_in="x:[50%];y:0;o:0;s:700;e:Power4.easeInOut;"
									data-transform_out="x:0;y:0;o:0;s:700;e:Power2.easeInOut;"><span class="icon large circle"><i class="circle icon-chart-line"></i></span>
								</div>

								<!-- LAYER NR. 8 -->
								<div class="tp-caption tp-resizeme large_white"
									data-x="center"
									data-y="210"
									data-start="6400"
									data-end="10000"
									data-transform_idle="o:1;"
									data-transform_in="y:[-100%];sX:1;sY:1;o:0;s:1100;e:Power4.easeInOut;"
									data-transform_out="y:0;s:1000;e:Power2.easeInOut;"><div class="separator light"></div>
								</div>

								<!-- LAYER NR. 9 -->
								<div class="tp-caption medium_white"
									data-x="center"
									data-y="260"
									data-start="6800"
									data-transform_idle="o:1;"
									data-transform_in="y:[-50%];sX:1;sY:1;o:0;s:1100;e:Power4.easeInOut;"
									data-transform_out="y:0;s:1000;e:Power2.easeInOut;"
									data-mask_in="x:0px;y:[-50%];s:inherit;e:inherit;"
									data-mask_out="x:inherit;y:inherit;s:inherit;e:inherit;">Lorem ipsum dolor sit amet, consectetur adipisicing elit. <br> Nesciunt, maiores, aliquid. Repellat eum numquam aliquid culpa offici, <br> tenetur fugiat dolorum sapiente eligendi...
								</div>

								<!-- LAYER NR. 10 -->
								<div class="tp-caption"
									data-x="center"
									data-y="bottom"
									data-voffset="100"
									data-start="1250"
									data-transform_idle="o:1;"
									data-transform_in="y:[100%];sX:1;sY:1;o:0;s:2000;e:Power4.easeInOut;"
									data-transform_out="y:[100%];s:1000;e:Power2.easeInOut;"
									data-mask_in="x:0px;y:[100%];s:inherit;e:inherit;"
									data-mask_out="x:inherit;y:inherit;s:inherit;e:inherit;">
										<a href="#page-start" class="btn btn-lg moving smooth-scroll"><i class="icon-down-open-big"></i><i class="icon-down-open-big"></i><i class="icon-down-open-big"></i></a>
								</div>

								</li>
								<!-- slide 1 end -->

								<!-- slide 2 start -->
								<!-- ================ -->
								<li data-transition="random" data-slotamount="7" data-masterspeed="default" data-title="Premium HTML5 Bootstrap Theme">

								<!-- main image -->
								<img src="images/slider-fullscreen-slide-2.jpg" alt="slidebg2" data-bgposition="center center" data-bgrepeat="no-repeat" data-bgfit="cover" class="rev-slidebg">

								<!-- Transparent Background -->
								<div class="tp-caption dark-translucent-bg"
									data-x="center"
									data-y="center"
									data-start="0"
									data-transform_idle="o:1;"
									data-transform_in="o:0;s:600;e:Power2.easeInOut;"
									data-transform_out="o:0;s:600;"
									data-width="5000"
									data-height="5000">
								</div>

								<!-- LAYER NR. 1 -->
								<div class="tp-caption large_white"
									data-x="left"
									data-y="110"
									data-start="1000"
									data-transform_idle="o:1;"
									data-transform_in="y:[100%];sX:1;sY:1;o:0;s:1100;e:Power4.easeInOut;"
									data-transform_out="y:[100%];s:1000;e:Power2.easeInOut;"
									data-mask_in="x:0px;y:[100%];s:inherit;e:inherit;"
									data-mask_out="x:inherit;y:inherit;s:inherit;e:inherit;"><span class="logo-font">The Project</span> <br> Premium HTML5 Bootstrap Theme
								</div>

								<!-- LAYER NR. 2 -->
								<div class="tp-caption medium_white"
									data-x="left"
									data-y="240"
									data-speed="500"
									data-start="1200"
									data-transform_idle="o:1;"
									data-transform_in="y:[100%];sX:1;sY:1;o:0;s:900;e:Power4.easeInOut;"
									data-transform_out="y:[100%];s:1000;e:Power2.easeInOut;"
									data-mask_in="x:0px;y:[100%];s:inherit;e:inherit;"
									data-mask_out="x:inherit;y:inherit;s:inherit;e:inherit;"><span class="icon default-bg circle small hidden-xs"><i class="fa fa-laptop"></i></span> 100% Responsive
								</div>

								<!-- LAYER NR. 3 -->
								<div class="tp-caption medium_white"
									data-x="left"
									data-y="300"
									data-speed="500"
									data-start="1400"
									data-transform_idle="o:1;"
									data-transform_in="y:[100%];sX:1;sY:1;o:0;s:900;e:Power4.easeInOut;"
									data-transform_out="y:[100%];s:1000;e:Power2.easeInOut;"
									data-mask_in="x:0px;y:[100%];s:inherit;e:inherit;"
									data-mask_out="x:inherit;y:inherit;s:inherit;e:inherit;"><span class="icon default-bg circle small hidden-xs"><i class="icon-check"></i></span> Bootstrap Based
								</div>

								<!-- LAYER NR. 4 -->
								<div class="tp-caption medium_white"
									data-x="left"
									data-y="360"
									data-speed="500"
									data-start="1600"
									data-transform_idle="o:1;"
									data-transform_in="y:[100%];sX:1;sY:1;o:0;s:900;e:Power4.easeInOut;"
									data-transform_out="y:[100%];s:1000;e:Power2.easeInOut;"
									data-mask_in="x:0px;y:[100%];s:inherit;e:inherit;"
									data-mask_out="x:inherit;y:inherit;s:inherit;e:inherit;"><span class="icon default-bg circle small hidden-xs"><i class="icon-gift"></i></span> Packed Full of Features
								</div>

								<!-- LAYER NR. 5 -->
								<div class="tp-caption medium_white"
									data-x="left"
									data-y="420"
									data-speed="500"
									data-start="1800"
									data-transform_idle="o:1;"
									data-transform_in="y:[100%];sX:1;sY:1;o:0;s:900;e:Power4.easeInOut;"
									data-transform_out="y:[100%];s:1000;e:Power2.easeInOut;"
									data-mask_in="x:0px;y:[100%];s:inherit;e:inherit;"
									data-mask_out="x:inherit;y:inherit;s:inherit;e:inherit;"><span class="icon default-bg circle small hidden-xs"><i class="icon-hourglass"></i></span> Very Easy to Customize
								</div>

								<!-- LAYER NR. 6 -->
								<div class="tp-caption small_white"
									data-x="left"
									data-y="490"
									data-speed="500"
									data-start="2000"
									data-transform_idle="o:1;"
									data-transform_in="y:[100%];sX:1;sY:1;o:0;s:900;e:Power4.easeInOut;"
									data-transform_out="y:[100%];s:1000;e:Power2.easeInOut;"
									data-mask_in="x:0px;y:[100%];s:inherit;e:inherit;"
									data-mask_out="x:inherit;y:inherit;s:inherit;e:inherit;"><a href="#" class="btn btn-default btn-lg btn-animated">Purchase <i class="fa fa-cart-arrow-down"></i></a>
								</div>
								</li>
								<!-- slide 2 end -->
							</ul>
							<div class="tp-bannertimer"></div>
						</div>
					</div>
					<!-- slider revolution end -->

				</div>
				<!-- slideshow end -->

			</div>
			<!-- banner end -->

			<div id="page-start"></div>

			<!-- section -->
			<!-- ================ -->
			<section id="about"  class="main-container">
				<div class="container">
					<div class="col-md-8 col-md-offset-2">
						<h2 class="text-center title">About <strong>Us</strong></h2>
						<div class="separator"></div>
						<p class="large text-center">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Numquam voluptas facere vero ex tempora saepe perspiciatis ducimus sequi animi.</p>
					</div>
					<div class="row">
						<div class="col-md-6">
							<h3 class="title">The Project is <span class="text-rotator" data-rotator-animation-effect="fadeIn">Multipurpose, Powerful, Multiconcept</span> Bootstrap Template</h3>
							<p>Lorem ipsum dolor sit amet, lotrem <span class="text-default">some colored text</span>. Nulla explicabo <strong>attention to this</strong> blanditiis, ex cupiditate ipsam debitis rem.</p>
							<ul class="list-icons">
								<li class="object-non-visible" data-animation-effect="fadeInUpSmall" data-effect-delay="100"><i class="icon-check-1"></i> Extremly Simple to Use</li>
								<li class="object-non-visible" data-animation-effect="fadeInUpSmall" data-effect-delay="150"><i class="icon-check-1"></i> Customize it in no time</li>
								<li class="object-non-visible" data-animation-effect="fadeInUpSmall" data-effect-delay="200"><i class="icon-check-1"></i> Unlimited options and variations</li>
								<li class="object-non-visible" data-animation-effect="fadeInUpSmall" data-effect-delay="250"><i class="icon-check-1"></i> We are here to support you</li>
							</ul>
							<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. <strong>Some bold text</strong>, unde voluptatum quidem explicabo et eius aut nisi dolore ut. Sapiente velit quidem, unde fugit. Neque illum, debitis ut, porro natus.</p>
						</div>
						<div class="col-md-6">
							<div class="overlay-container overlay-visible">
								<img src="images/section-image-5.jpg" alt="">
								<a href="#" class="overlay-link"><i class="fa fa-link"></i></a>
								<div class="overlay-bottom hidden-xs">
									<div class="text">
										Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt nobis sunt, quae alias impedit ea molestias recusandae.
									</div>
								</div>
							</div>
						</div>
					</div>
					<h3 class="title">Our <strong>Team</strong></h3>
					<div class="separator-2"></div>
					<div class="row grid-space-10">
						<div class="col-sm-4">
							<div class="team-member image-box style-2 shadow bordered light-gray-bg text-center">
								<div class="overlay-container overlay-visible">
									<img src="images/team-member-1.jpg" alt="">
									<div class="overlay-bottom">
										<ul class="social-links circle dark margin-clear">
											<li class="skype"><a target="_blank" href="http://www.skype.com"><i class="fa fa-skype"></i></a></li>
											<li class="linkedin"><a target="_blank" href="http://www.linkedin.com"><i class="fa fa-linkedin"></i></a></li>
											<li class="xing"><a target="_blank" href="https://www.xing.com/"><i class="fa fa-xing"></i></a></li>
										</ul>
									</div>
								</div>
								<div class="body">
									<h3 class="margin-clear">Jane Doe</h3>
									<small>CEO</small>
									<div class="separator mt-10"></div>
									<p class="small margin-clear">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptates praesentium nulla cupiditate!</p>
									<a href="mailto:info@theproject.com" class="btn btn-lg-link link-dark"><i class="pr-10 fa fa-envelope-o"></i>Contact Me</a>
								</div>
							</div>
						</div>
						<div class="col-sm-4">
							<div class="team-member image-box style-2 shadow bordered light-gray-bg text-center">
								<div class="overlay-container overlay-visible">
									<img src="images/team-member-2.jpg" alt="">
									<div class="overlay-bottom">
										<ul class="social-links circle dark margin-clear">
											<li class="skype"><a target="_blank" href="http://www.skype.com"><i class="fa fa-skype"></i></a></li>
											<li class="linkedin"><a target="_blank" href="http://www.linkedin.com"><i class="fa fa-linkedin"></i></a></li>
											<li class="xing"><a target="_blank" href="https://www.xing.com/"><i class="fa fa-xing"></i></a></li>
										</ul>
									</div>
								</div>
								<div class="body">
									<h3 class="margin-clear">John Doe</h3>
									<small>CTO</small>
									<div class="separator mt-10"></div>
									<p class="small margin-clear">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptates praesentium nulla cupiditate!</p>
									<a href="mailto:info@theproject.com" class="btn btn-lg-link link-dark"><i class="pr-10 fa fa-envelope-o"></i>Contact Me</a>
								</div>
							</div>
						</div>
						<div class="col-sm-4">
							<div class="team-member image-box style-2 shadow bordered light-gray-bg text-center">
								<div class="overlay-container overlay-visible">
									<img src="images/team-member-3.jpg" alt="">
									<div class="overlay-bottom">
										<ul class="social-links circle dark margin-clear">
											<li class="skype"><a target="_blank" href="http://www.skype.com"><i class="fa fa-skype"></i></a></li>
											<li class="linkedin"><a target="_blank" href="http://www.linkedin.com"><i class="fa fa-linkedin"></i></a></li>
											<li class="xing"><a target="_blank" href="https://www.xing.com/"><i class="fa fa-xing"></i></a></li>
										</ul>
									</div>
								</div>
								<div class="body">
									<h3 class="margin-clear">Anne Crayz</h3>
									<small>Project Manager</small>
									<div class="separator mt-10"></div>
									<p class="small margin-clear">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptates praesentium nulla cupiditate!</p>
									<a href="mailto:info@theproject.com" class="btn btn-lg-link link-dark"><i class="pr-10 fa fa-envelope-o"></i>Contact Me</a>
								</div>
							</div>
						</div>
					</div>
				</div>
				<br>
			</section>
			<!-- section end -->

			<!-- section start -->
			<!-- ================ -->
			<section class="dark-translucent-bg pv-30 background-img-1" style="background-position:50% 30%;">
				<div class="container">
					<div class="row">
						<div class="col-md-8 col-md-offset-2">
							<h2 class="text-center">Why <strong>Choose</strong> Us?</h2>
							<div class="separator"></div>
							<p class="large text-center">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Numquam voluptas facere vero ex tempora saepe perspiciatis ducimus sequi animi.</p>
						</div>
					</div>
					<div class="row">
						<div class="col-md-6">
							<div class="row">
								<div class="col-md-6 ">
									<div class="feature-box-2 object-non-visible animated object-visible fadeInDownSmall" data-animation-effect="fadeInDownSmall" data-effect-delay="100">
										<span class="icon default-bg small"><i class="fa fa-heart-o"></i></span>
										<div class="body">
											<h4 class="title">Clean Code &amp; Design</h4>
											<p>Voluptatem ad provident non repudiandae beatae cupiditate amet reiciendis lorem dolor consectetur.</p>
										</div>
									</div>
								</div>
								<div class="col-md-6 ">
									<div class="feature-box-2 object-non-visible animated object-visible fadeInDownSmall" data-animation-effect="fadeInDownSmall" data-effect-delay="150">
										<span class="icon default-bg small"><i class="fa fa-connectdevelop"></i></span>
										<div class="body">
											<h4 class="title">Extremely Flexible</h4>
											<p>Iure sequi unde hic. Sapiente quaerat sequi inventore veritatis cumque lorem ipsum dolor sit amet, consectetur.</p>
										</div>
									</div>
								</div>
								<div class="col-md-6 ">
									<div class="feature-box-2 object-non-visible animated object-visible fadeInDownSmall" data-animation-effect="fadeInDownSmall" data-effect-delay="200">
										<span class="icon default-bg small"><i class="icon-snow"></i></span>
										<div class="body">
											<h4 class="title">Latest Technologies</h4>
											<p>Inventore dolores aut laboriosam cum consequuntur delectus sequi lorem ipsum dolor sit amet, consectetur.</p>
										</div>
									</div>
								</div>
								<div class="col-md-6 ">
									<div class="feature-box-2 object-non-visible animated object-visible fadeInDownSmall" data-animation-effect="fadeInDownSmall" data-effect-delay="250">
										<span class="icon default-bg small"><i class="icon-check"></i></span>
										<div class="body">
											<h4 class="title">Bootstrap Based</h4>
											<p>Inventore dolores aut laboriosam cum consequuntur delectus sequi lorem ipsum dolor sit amet, consectetur.</p>
										</div>
									</div>
								</div>
							</div>
						</div>
						<div class="col-md-6">
							<div class="embed-responsive embed-responsive-16by9">
								<iframe class="embed-responsive-item" src="//player.vimeo.com/video/29198414?byline=0&amp;portrait=0"></iframe>
								<p><a href="http://vimeo.com/29198414">Introducing Vimeo Music Store</a> from <a href="http://vimeo.com/staff">Vimeo Staff</a> on <a href="https://vimeo.com">Vimeo</a>.</p>
							</div>
						</div>
					</div>
				</div>
			</section>
			<!-- section end -->

			<!-- section start -->
			<!-- ================ -->
			<section id="services" class="light-gray-bg pv-30 clearfix">
				<div class="container">
					<div class="row">
						<div class="col-md-8 col-md-offset-2">
							<h2 class="text-center">Main <strong>Services</strong></h2>
							<div class="separator"></div>
							<p class="large text-center">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Numquam voluptas facere vero ex tempora saepe perspiciatis ducimus sequi animi.</p>
						</div>
						<div class="col-sm-4">
							<div class="image-box style-2 mb-20">
								<div class="overlay-container overlay-visible">
									<img src="images/service-1.jpg" alt="">
									<a href="images/service-1.jpg" class="overlay-link popup-img"><i class="fa fa-plus"></i></a>
									<div class="overlay-bottom hidden-xs">
										<div class="text">
											<p class="lead margin-clear text-left">Service One</p>
										</div>
									</div>
								</div>
								<div class="body padding-horizontal-clear">
									<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquam atque ipsam nihil, adipisci rem minus? Voluptatem distinctio laborum porro aspernatur.</p>
								</div>
							</div>
						</div>
						<div class="col-sm-4">
							<div class="image-box style-2 mb-20">
								<div class="overlay-container overlay-visible">
									<img src="images/service-2.jpg" alt="">
									<a href="images/service-2.jpg" class="overlay-link popup-img"><i class="fa fa-plus"></i></a>
									<div class="overlay-bottom hidden-xs">
										<div class="text">
											<p class="lead margin-clear text-left">Service One</p>
										</div>
									</div>
								</div>
								<div class="body padding-horizontal-clear">
									<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquam atque ipsam nihil, adipisci rem minus? Voluptatem distinctio laborum porro aspernatur.</p>
								</div>
							</div>
						</div>
						<div class="col-sm-4">
							<div class="image-box style-2 mb-20">
								<div class="overlay-container overlay-visible">
									<img src="images/service-3.jpg" alt="">
									<a href="images/service-3.jpg" class="overlay-link popup-img"><i class="fa fa-plus"></i></a>
									<div class="overlay-bottom hidden-xs">
										<div class="text">
											<p class="lead margin-clear text-left">Service One</p>
										</div>
									</div>
								</div>
								<div class="body padding-horizontal-clear">
									<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquam atque ipsam nihil, adipisci rem minus? Voluptatem distinctio laborum porro aspernatur.</p>
								</div>
							</div>
						</div>
					</div>
				</div>
			</section>
			<!-- section end -->

			<!-- section start -->
			<!-- ================ -->
			<section class="section dark-bg clearfix">
				<div class="container">
					<div class="row">
						<div class="col-md-12">
							<div class="call-to-action text-center">
								<div class="row">
									<div class="col-sm-8">
										<h1 class="title">Don't Miss Out Our Offers</h1>
										<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Rem quasi explicabo consequatur consectetur, a atque voluptate officiis eligendi nostrum.</p>
									</div>
									<div class="col-sm-4">
										<br>
										<p><a href="#" class="btn btn-lg btn-gray-transparent btn-animated">Learn More<i class="fa fa-arrow-right pl-20"></i></a></p>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</section>
			<!-- section end -->

			<!-- section -->
			<!-- ================ -->
			<section class="pv-30">
				<div class="container">
					<div class="row">
						<div class="col-md-8 col-md-offset-2">
							<h2 class="text-center">More <strong>Services</strong></h2>
							<div class="separator"></div>
							<p class="large text-center">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Numquam voluptas facere vero ex tempora saepe perspiciatis ducimus sequi animi.</p>
						</div>
					</div>
					<div class="row">
						<div class="col-md-4 ">
							<div class="pv-20 ph-20 feature-box-2 light-gray-bg boxed shadow object-non-visible" data-animation-effect="fadeInDownSmall" data-effect-delay="100">
								<span class="icon without-bg"><i class="fa fa-diamond"></i></span>
								<div class="body">
									<h4 class="title">Clean Code &amp; Design</h4>
									<p>Voluptatem ad provident non repudiandae beatae cupiditate amet reiciendis lorem dolor consectetur.</p>
								</div>
							</div>
						</div>
						<div class="col-md-4 ">
							<div class="pv-20 ph-20 feature-box-2 light-gray-bg boxed shadow object-non-visible" data-animation-effect="fadeInDownSmall" data-effect-delay="150">
								<span class="icon without-bg"><i class="fa fa-connectdevelop"></i></span>
								<div class="body">
									<h4 class="title">Extremely Flexible</h4>
									<p>Iure sequi unde hic. Sapiente quaerat sequi inventore veritatis cumque lorem ipsum dolor sit amet, consectetur.</p>
								</div>
							</div>
						</div>
						<div class="col-md-4 ">
							<div class="pv-20 ph-20 feature-box-2 light-gray-bg boxed shadow object-non-visible" data-animation-effect="fadeInDownSmall" data-effect-delay="200">
								<span class="icon without-bg"><i class="icon-snow"></i></span>
								<div class="body">
									<h4 class="title">Latest Technologies</h4>
									<p>Inventore dolores aut laboriosam cum consequuntur delectus sequi lorem ipsum dolor sit amet, consectetur.</p>
								</div>
							</div>
						</div>
					</div>
					<div class="row">
						<div class="col-md-4 ">
							<div class="pv-20 ph-20 feature-box-2 light-gray-bg boxed shadow object-non-visible" data-animation-effect="fadeInDownSmall" data-effect-delay="250">
								<span class="icon without-bg"><i class="icon-megaphone"></i></span>
								<div class="body">
									<h4 class="title">Easy to Use</h4>
									<p>Voluptatem ad provident non repudiandae beatae cupiditate amet reiciendis lorem dolor consectetur.</p>
								</div>
							</div>
						</div>
						<div class="col-md-4 ">
							<div class="pv-20 ph-20 feature-box-2 light-gray-bg boxed shadow object-non-visible" data-animation-effect="fadeInDownSmall" data-effect-delay="300">
								<span class="icon without-bg"><i class="fa fa-arrows"></i></span>
								<div class="body">
									<h4 class="title">Responsive Design</h4>
									<p>Iure sequi unde hic. Sapiente quaerat sequi inventore veritatis cumque lorem ipsum dolor sit amet, consectetur.</p>
								</div>
							</div>
						</div>
						<div class="col-md-4 ">
							<div class="pv-20 ph-20 feature-box-2 light-gray-bg boxed shadow object-non-visible" data-animation-effect="fadeInDownSmall" data-effect-delay="350">
								<span class="icon without-bg"><i class="icon-star-empty"></i></span>
								<div class="body">
									<h4 class="title">Deticated Support</h4>
									<p>Inventore dolores aut laboriosam cum consequuntur delectus sequi lorem ipsum dolor sit amet, consectetur.</p>
								</div>
							</div>
						</div>
					</div>
				</div>
			</section>
			<!-- section end -->

			<!-- section start -->
			<!-- ================ -->
			<section id="portfolio" class="section pv-30 light-gray-bg">
				<div class="container">
					<div class="row">
						<div class="col-md-8 col-md-offset-2 text-center">
							<h2 class="title"><span class="text-muted">Our</span> <strong>Portfolio</strong></h2>
							<div class="separator"></div>
						</div>
					</div>
				</div>
				<!-- isotope filters start -->
				<div class="filters text-center">
					<ul class="nav nav-pills">
						<li class="active"><a href="#" data-filter="*">All</a></li>
						<li><a href="#" data-filter=".web-design">Web design</a></li>
						<li><a href="#" data-filter=".app-development">App development</a></li>
						<li><a href="#" data-filter=".site-building">Site building</a></li>
					</ul>
				</div>
				<!-- isotope filters end -->
				<div class="isotope-container row grid-space-0 mb-20">
					<div class="col-sm-6 col-md-3 isotope-item web-design">
						<div id="carousel-portfolio" class="carousel slide" data-ride="carousel">
							<!-- Indicators -->
							<ol class="carousel-indicators bottom margin-clear">
								<li data-target="#carousel-portfolio" data-slide-to="0" class="active"></li>
								<li data-target="#carousel-portfolio" data-slide-to="1"></li>
								<li data-target="#carousel-portfolio" data-slide-to="2"></li>
							</ol>

							<!-- Wrapper for slides -->
							<div class="carousel-inner" role="listbox">
								<div class="item active">
									<div class="image-box text-center">
										<div class="overlay-container">
											<img src="images/portfolio-1.jpg" alt="">
											<div class="overlay-top">
												<div class="text">
													<h3><a href="#project-1" data-toggle="modal">Project Title</a></h3>
													<p class="small">Web Design</p>
												</div>
											</div>
											<div class="overlay-bottom">
												<div class="links">
													<a href="#project-1" data-toggle="modal" class="btn btn-gray-transparent btn-animated btn-sm">View Details <i class="pl-10 fa fa-arrow-right"></i></a>
												</div>
											</div>
										</div>
									</div>
								</div>
								<div class="item">
									<div class="image-box text-center">
										<div class="overlay-container">
											<img src="images/portfolio-1-2.jpg" alt="">
											<div class="overlay-top">
												<div class="text">
													<h3><a href="#project-1" data-toggle="modal">Project Title</a></h3>
													<p class="small">Web Design</p>
												</div>
											</div>
											<div class="overlay-bottom">
												<div class="links">
													<a href="#project-1" data-toggle="modal" class="btn btn-gray-transparent btn-animated btn-sm">View Details <i class="pl-10 fa fa-arrow-right"></i></a>
												</div>
											</div>
										</div>
									</div>
								</div>
								<div class="item">
									<div class="image-box text-center">
										<div class="overlay-container">
											<img src="images/portfolio-1-3.jpg" alt="">
											<div class="overlay-top">
												<div class="text">
													<h3><a href="#project-1" data-toggle="modal">Project Title</a></h3>
													<p class="small">Web Design</p>
												</div>
											</div>
											<div class="overlay-bottom">
												<div class="links">
													<a href="#project-1" data-toggle="modal" class="btn btn-gray-transparent btn-animated btn-sm">View Details <i class="pl-10 fa fa-arrow-right"></i></a>
												</div>
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
						<!-- Modal -->
						<div class="modal fade" id="project-1" tabindex="-1" role="dialog" aria-labelledby="project-1-label" aria-hidden="true">
							<div class="modal-dialog modal-lg">
								<div class="modal-content">
									<div class="modal-header">
										<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
										<h4 class="modal-title" id="project-1-label">Project Title</h4>
									</div>
									<div class="modal-body">
										<div class="row">
											<div class="col-md-6">
												<h3>Project Description</h3>
												<div class="separator-2"></div>
												<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Atque sed, quidem quis praesentium, ut unde. Quae sed, incidunt laudantium nesciunt, optio corporis quod earum pariatur omnis illo saepe numquam suscipit, nemo placeat dignissimos eius mollitia et quas officia doloremque ipsum labore rem deserunt vero! Magnam totam delectus accusantium voluptas et, tempora quos atque, fugiat, obcaecati voluptatibus commodi illo voluptates dolore nemo quo soluta quis.</p>
												<p>Molestiae sed enim laboriosam atque delectus voluptates rerum nostrum sapiente obcaecati molestias quasi optio exercitationem, voluptate quis consequatur libero incidunt, in, quod. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eos nobis officiis, autem earum tenetur quidem. Quae non dicta earum. Ipsum autem eaque cum dolor placeat corporis quisquam dolorum at nesciunt.</p>
											</div>
											<div class="col-md-6">
												<div class="owl-carousel content-slider-with-controls">
													<div class="overlay-container">
														<img src="images/portfolio-1.jpg" alt="">
													</div>
													<div class="overlay-container">
														<img src="images/portfolio-1-2.jpg" alt="">
													</div>
													<div class="overlay-container">
														<img src="images/portfolio-1-3.jpg" alt="">
													</div>
												</div>
											</div>
										</div>
										<div class="row">
											<div class="col-md-6 col-xs-6">
												<h3>Project Info</h3>
												<ul class="list">
													<li><strong class="vertical-divider">Client </strong> John Doe</li>
													<li><strong class="vertical-divider">Date </strong> OCT 2014</li>
													<li><strong class="vertical-divider">In </strong> Web Design</li>
													<li><strong class="vertical-divider">Place </strong> Europe</li>
													<li><strong class="vertical-divider">URL </strong> <a href="#">www.theproject.com</a></li>
												</ul>
											</div>
											<div class="col-md-6 col-xs-12">
												<h3>More info</h3>
												<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor.</p>
												<form role="form">
													<div class="form-group has-feedback">
														<input type="email" class="form-control" id="project-1-email" placeholder="Email">
														<i class="fa fa-envelope-o form-control-feedback"></i>
													</div>
													<a href="#" class="btn btn-default margin-top-clear">Subscribe</a>
												</form>
											</div>
										</div>
									</div>
									<div class="modal-footer">
										<button type="button" class="btn btn-sm btn-default" data-dismiss="modal">Close</button>
									</div>
								</div>
							</div>
						</div>
						<!-- Modal end -->
					</div>
					<div class="col-sm-6 col-md-3 isotope-item app-development">
						<div class="image-box text-center">
							<div class="overlay-container">
								<img src="images/portfolio-2.jpg" alt="">
								<div class="overlay-top">
									<div class="text">
										<h3><a href="#project-2" data-toggle="modal">Project Title</a></h3>
										<p class="small">App Development</p>
									</div>
								</div>
								<div class="overlay-bottom">
									<div class="links">
										<a href="#project-2" data-toggle="modal" class="btn btn-gray-transparent btn-animated btn-sm">View Details <i class="pl-10 fa fa-arrow-right"></i></a>
									</div>
								</div>
							</div>
						</div>
						<!-- Modal -->
						<div class="modal fade" id="project-2" tabindex="-1" role="dialog" aria-labelledby="project-2-label" aria-hidden="true">
							<div class="modal-dialog modal-lg">
								<div class="modal-content">
									<div class="modal-header">
										<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
										<h4 class="modal-title" id="project-2-label">Project Title</h4>
									</div>
									<div class="modal-body">
										<div class="row">
											<div class="col-md-6">
												<h3>Project Description</h3>
												<div class="separator-2"></div>
												<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Atque sed, quidem quis praesentium, ut unde. Quae sed, incidunt laudantium nesciunt, optio corporis quod earum pariatur omnis illo saepe numquam suscipit, nemo placeat dignissimos eius mollitia et quas officia doloremque ipsum labore rem deserunt vero! Magnam totam delectus accusantium voluptas et, tempora quos atque, fugiat, obcaecati voluptatibus commodi illo voluptates dolore nemo quo soluta quis.</p>
												<p>Molestiae sed enim laboriosam atque delectus voluptates rerum nostrum sapiente obcaecati molestias quasi optio exercitationem, voluptate quis consequatur libero incidunt, in, quod. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eos nobis officiis, autem earum tenetur quidem. Quae non dicta earum. Ipsum autem eaque cum dolor placeat corporis quisquam dolorum at nesciunt.</p>
											</div>
											<div class="col-md-6">
												<div class="owl-carousel content-slider-with-controls">
													<div class="overlay-container">
														<img src="images/portfolio-1.jpg" alt="">
													</div>
													<div class="overlay-container">
														<img src="images/portfolio-1-2.jpg" alt="">
													</div>
													<div class="overlay-container">
														<img src="images/portfolio-1-3.jpg" alt="">
													</div>
												</div>
											</div>
										</div>
										<div class="row">
											<div class="col-md-6 col-xs-6">
												<h3>Project Info</h3>
												<ul class="list">
													<li><strong class="vertical-divider">Client </strong> John Doe</li>
													<li><strong class="vertical-divider">Date </strong> OCT 2014</li>
													<li><strong class="vertical-divider">In </strong> Web Design</li>
													<li><strong class="vertical-divider">Place </strong> Europe</li>
													<li><strong class="vertical-divider">URL </strong> <a href="#">www.theproject.com</a></li>
												</ul>
											</div>
											<div class="col-md-6 col-xs-12">
												<h3>More info</h3>
												<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor.</p>
												<form role="form">
													<div class="form-group has-feedback">
														<input type="email" class="form-control" id="project-2-email" placeholder="Email">
														<i class="fa fa-envelope-o form-control-feedback"></i>
													</div>
													<a href="#" class="btn btn-default margin-top-clear">Subscribe</a>
												</form>
											</div>
										</div>
									</div>
									<div class="modal-footer">
										<button type="button" class="btn btn-sm btn-default" data-dismiss="modal">Close</button>
									</div>
								</div>
							</div>
						</div>
						<!-- Modal end -->
					</div>
					<div class="col-sm-6 col-md-3 isotope-item app-development">
						<div class="image-box text-center">
							<div class="overlay-container">
								<img src="images/portfolio-3.jpg" alt="">
								<div class="overlay-top">
									<div class="text">
										<h3><a href="#project-3" data-toggle="modal">Project Title</a></h3>
										<p class="small">App Development</p>
									</div>
								</div>
								<div class="overlay-bottom">
									<div class="links">
										<a href="#project-3" data-toggle="modal" class="btn btn-gray-transparent btn-animated btn-sm">View Details <i class="pl-10 fa fa-arrow-right"></i></a>
									</div>
								</div>
							</div>
						</div>
						<!-- Modal -->
						<div class="modal fade" id="project-3" tabindex="-1" role="dialog" aria-labelledby="project-3-label" aria-hidden="true">
							<div class="modal-dialog modal-lg">
								<div class="modal-content">
									<div class="modal-header">
										<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
										<h4 class="modal-title" id="project-3-label">Project Title</h4>
									</div>
									<div class="modal-body">
										<div class="row">
											<div class="col-md-6">
												<h3>Project Description</h3>
												<div class="separator-2"></div>
												<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Atque sed, quidem quis praesentium, ut unde. Quae sed, incidunt laudantium nesciunt, optio corporis quod earum pariatur omnis illo saepe numquam suscipit, nemo placeat dignissimos eius mollitia et quas officia doloremque ipsum labore rem deserunt vero! Magnam totam delectus accusantium voluptas et, tempora quos atque, fugiat, obcaecati voluptatibus commodi illo voluptates dolore nemo quo soluta quis.</p>
												<p>Molestiae sed enim laboriosam atque delectus voluptates rerum nostrum sapiente obcaecati molestias quasi optio exercitationem, voluptate quis consequatur libero incidunt, in, quod. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eos nobis officiis, autem earum tenetur quidem. Quae non dicta earum. Ipsum autem eaque cum dolor placeat corporis quisquam dolorum at nesciunt.</p>
											</div>
											<div class="col-md-6">
												<div class="owl-carousel content-slider-with-controls">
													<div class="overlay-container">
														<img src="images/portfolio-1.jpg" alt="">
													</div>
													<div class="overlay-container">
														<img src="images/portfolio-1-2.jpg" alt="">
													</div>
													<div class="overlay-container">
														<img src="images/portfolio-1-3.jpg" alt="">
													</div>
												</div>
											</div>
										</div>
										<div class="row">
											<div class="col-md-6 col-xs-6">
												<h3>Project Info</h3>
												<ul class="list">
													<li><strong class="vertical-divider">Client </strong> John Doe</li>
													<li><strong class="vertical-divider">Date </strong> OCT 2014</li>
													<li><strong class="vertical-divider">In </strong> Web Design</li>
													<li><strong class="vertical-divider">Place </strong> Europe</li>
													<li><strong class="vertical-divider">URL </strong> <a href="#">www.theproject.com</a></li>
												</ul>
											</div>
											<div class="col-md-6 col-xs-12">
												<h3>More info</h3>
												<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor.</p>
												<form role="form">
													<div class="form-group has-feedback">
														<input type="email" class="form-control" id="project-3-email" placeholder="Email">
														<i class="fa fa-envelope-o form-control-feedback"></i>
													</div>
													<a href="#" class="btn btn-default margin-top-clear">Subscribe</a>
												</form>
											</div>
										</div>
									</div>
									<div class="modal-footer">
										<button type="button" class="btn btn-sm btn-default" data-dismiss="modal">Close</button>
									</div>
								</div>
							</div>
						</div>
						<!-- Modal end -->
					</div>
					<div class="col-sm-6 col-md-3 isotope-item web-design">
						<div class="image-box text-center">
							<div class="overlay-container">
								<img src="images/portfolio-4.jpg" alt="">
								<div class="overlay-top">
									<div class="text">
										<h3><a href="#project-4" data-toggle="modal">Project Title</a></h3>
										<p class="small">Web Design</p>
									</div>
								</div>
								<div class="overlay-bottom">
									<div class="links">
										<a href="#project-4" data-toggle="modal" class="btn btn-gray-transparent btn-animated btn-sm">View Details <i class="pl-10 fa fa-arrow-right"></i></a>
									</div>
								</div>
							</div>
						</div>
						<!-- Modal -->
						<div class="modal fade" id="project-4" tabindex="-1" role="dialog" aria-labelledby="project-4-label" aria-hidden="true">
							<div class="modal-dialog modal-lg">
								<div class="modal-content">
									<div class="modal-header">
										<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
										<h4 class="modal-title" id="project-4-label">Project Title</h4>
									</div>
									<div class="modal-body">
										<div class="row">
											<div class="col-md-6">
												<h3>Project Description</h3>
												<div class="separator-2"></div>
												<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Atque sed, quidem quis praesentium, ut unde. Quae sed, incidunt laudantium nesciunt, optio corporis quod earum pariatur omnis illo saepe numquam suscipit, nemo placeat dignissimos eius mollitia et quas officia doloremque ipsum labore rem deserunt vero! Magnam totam delectus accusantium voluptas et, tempora quos atque, fugiat, obcaecati voluptatibus commodi illo voluptates dolore nemo quo soluta quis.</p>
												<p>Molestiae sed enim laboriosam atque delectus voluptates rerum nostrum sapiente obcaecati molestias quasi optio exercitationem, voluptate quis consequatur libero incidunt, in, quod. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eos nobis officiis, autem earum tenetur quidem. Quae non dicta earum. Ipsum autem eaque cum dolor placeat corporis quisquam dolorum at nesciunt.</p>
											</div>
											<div class="col-md-6">
												<div class="owl-carousel content-slider-with-controls">
													<div class="overlay-container">
														<img src="images/portfolio-1.jpg" alt="">
													</div>
													<div class="overlay-container">
														<img src="images/portfolio-1-2.jpg" alt="">
													</div>
													<div class="overlay-container">
														<img src="images/portfolio-1-3.jpg" alt="">
													</div>
												</div>
											</div>
										</div>
										<div class="row">
											<div class="col-md-6 col-xs-6">
												<h3>Project Info</h3>
												<ul class="list">
													<li><strong class="vertical-divider">Client </strong> John Doe</li>
													<li><strong class="vertical-divider">Date </strong> OCT 2014</li>
													<li><strong class="vertical-divider">In </strong> Web Design</li>
													<li><strong class="vertical-divider">Place </strong> Europe</li>
													<li><strong class="vertical-divider">URL </strong> <a href="#">www.theproject.com</a></li>
												</ul>
											</div>
											<div class="col-md-6 col-xs-12">
												<h3>More info</h3>
												<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor.</p>
												<form role="form">
													<div class="form-group has-feedback">
														<input type="email" class="form-control" id="project-4-email" placeholder="Email">
														<i class="fa fa-envelope-o form-control-feedback"></i>
													</div>
													<a href="#" class="btn btn-default margin-top-clear">Subscribe</a>
												</form>
											</div>
										</div>
									</div>
									<div class="modal-footer">
										<button type="button" class="btn btn-sm btn-default" data-dismiss="modal">Close</button>
									</div>
								</div>
							</div>
						</div>
						<!-- Modal end -->
					</div>
					<div class="col-sm-6 col-md-3 isotope-item site-building">
						<div class="image-box text-center">
							<div class="overlay-container">
								<img src="images/portfolio-5.jpg" alt="">
								<div class="overlay-top">
									<div class="text">
										<h3><a href="#project-5" data-toggle="modal">Project Title</a></h3>
										<p class="small">Site Building</p>
									</div>
								</div>
								<div class="overlay-bottom">
									<div class="links">
										<a href="#project-5" data-toggle="modal" class="btn btn-gray-transparent btn-animated btn-sm">View Details <i class="pl-10 fa fa-arrow-right"></i></a>
									</div>
								</div>
							</div>
						</div>
						<!-- Modal -->
						<div class="modal fade" id="project-5" tabindex="-1" role="dialog" aria-labelledby="project-5-label" aria-hidden="true">
							<div class="modal-dialog modal-lg">
								<div class="modal-content">
									<div class="modal-header">
										<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
										<h4 class="modal-title" id="project-5-label">Project Title</h4>
									</div>
									<div class="modal-body">
										<div class="row">
											<div class="col-md-6">
												<h3>Project Description</h3>
												<div class="separator-2"></div>
												<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Atque sed, quidem quis praesentium, ut unde. Quae sed, incidunt laudantium nesciunt, optio corporis quod earum pariatur omnis illo saepe numquam suscipit, nemo placeat dignissimos eius mollitia et quas officia doloremque ipsum labore rem deserunt vero! Magnam totam delectus accusantium voluptas et, tempora quos atque, fugiat, obcaecati voluptatibus commodi illo voluptates dolore nemo quo soluta quis.</p>
												<p>Molestiae sed enim laboriosam atque delectus voluptates rerum nostrum sapiente obcaecati molestias quasi optio exercitationem, voluptate quis consequatur libero incidunt, in, quod. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eos nobis officiis, autem earum tenetur quidem. Quae non dicta earum. Ipsum autem eaque cum dolor placeat corporis quisquam dolorum at nesciunt.</p>
											</div>
											<div class="col-md-6">
												<div class="owl-carousel content-slider-with-controls">
													<div class="overlay-container">
														<img src="images/portfolio-1.jpg" alt="">
													</div>
													<div class="overlay-container">
														<img src="images/portfolio-1-2.jpg" alt="">
													</div>
													<div class="overlay-container">
														<img src="images/portfolio-1-3.jpg" alt="">
													</div>
												</div>
											</div>
										</div>
										<div class="row">
											<div class="col-md-6 col-xs-6">
												<h3>Project Info</h3>
												<ul class="list">
													<li><strong class="vertical-divider">Client </strong> John Doe</li>
													<li><strong class="vertical-divider">Date </strong> OCT 2014</li>
													<li><strong class="vertical-divider">In </strong> Web Design</li>
													<li><strong class="vertical-divider">Place </strong> Europe</li>
													<li><strong class="vertical-divider">URL </strong> <a href="#">www.theproject.com</a></li>
												</ul>
											</div>
											<div class="col-md-6 col-xs-12">
												<h3>More info</h3>
												<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor.</p>
												<form role="form">
													<div class="form-group has-feedback">
														<input type="email" class="form-control" id="project-5-email" placeholder="Email">
														<i class="fa fa-envelope-o form-control-feedback"></i>
													</div>
													<a href="#" class="btn btn-default margin-top-clear">Subscribe</a>
												</form>
											</div>
										</div>
									</div>
									<div class="modal-footer">
										<button type="button" class="btn btn-sm btn-default" data-dismiss="modal">Close</button>
									</div>
								</div>
							</div>
						</div>
						<!-- Modal end -->
					</div>
					<div class="col-sm-6 col-md-3 isotope-item app-development">
						<div class="image-box text-center">
							<div class="overlay-container">
								<img src="images/portfolio-6.jpg" alt="">
								<div class="overlay-top">
									<div class="text">
										<h3><a href="#project-6" data-toggle="modal">Project Title</a></h3>
										<p class="small">App Development</p>
									</div>
								</div>
								<div class="overlay-bottom">
									<div class="links">
										<a href="#project-6" data-toggle="modal" class="btn btn-gray-transparent btn-animated btn-sm">View Details <i class="pl-10 fa fa-arrow-right"></i></a>
									</div>
								</div>
							</div>
						</div>
						<!-- Modal -->
						<div class="modal fade" id="project-6" tabindex="-1" role="dialog" aria-labelledby="project-6-label" aria-hidden="true">
							<div class="modal-dialog modal-lg">
								<div class="modal-content">
									<div class="modal-header">
										<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
										<h4 class="modal-title" id="project-6-label">Project Title</h4>
									</div>
									<div class="modal-body">
										<div class="row">
											<div class="col-md-6">
												<h3>Project Description</h3>
												<div class="separator-2"></div>
												<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Atque sed, quidem quis praesentium, ut unde. Quae sed, incidunt laudantium nesciunt, optio corporis quod earum pariatur omnis illo saepe numquam suscipit, nemo placeat dignissimos eius mollitia et quas officia doloremque ipsum labore rem deserunt vero! Magnam totam delectus accusantium voluptas et, tempora quos atque, fugiat, obcaecati voluptatibus commodi illo voluptates dolore nemo quo soluta quis.</p>
												<p>Molestiae sed enim laboriosam atque delectus voluptates rerum nostrum sapiente obcaecati molestias quasi optio exercitationem, voluptate quis consequatur libero incidunt, in, quod. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eos nobis officiis, autem earum tenetur quidem. Quae non dicta earum. Ipsum autem eaque cum dolor placeat corporis quisquam dolorum at nesciunt.</p>
											</div>
											<div class="col-md-6">
												<div class="owl-carousel content-slider-with-controls">
													<div class="overlay-container">
														<img src="images/portfolio-1.jpg" alt="">
													</div>
													<div class="overlay-container">
														<img src="images/portfolio-1-2.jpg" alt="">
													</div>
													<div class="overlay-container">
														<img src="images/portfolio-1-3.jpg" alt="">
													</div>
												</div>
											</div>
										</div>
										<div class="row">
											<div class="col-md-6 col-xs-6">
												<h3>Project Info</h3>
												<ul class="list">
													<li><strong class="vertical-divider">Client </strong> John Doe</li>
													<li><strong class="vertical-divider">Date </strong> OCT 2014</li>
													<li><strong class="vertical-divider">In </strong> Web Design</li>
													<li><strong class="vertical-divider">Place </strong> Europe</li>
													<li><strong class="vertical-divider">URL </strong> <a href="#">www.theproject.com</a></li>
												</ul>
											</div>
											<div class="col-md-6 col-xs-12">
												<h3>More info</h3>
												<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor.</p>
												<form role="form">
													<div class="form-group has-feedback">
														<input type="email" class="form-control" id="project-6-email" placeholder="Email">
														<i class="fa fa-envelope-o form-control-feedback"></i>
													</div>
													<a href="#" class="btn btn-default margin-top-clear">Subscribe</a>
												</form>
											</div>
										</div>
									</div>
									<div class="modal-footer">
										<button type="button" class="btn btn-sm btn-default" data-dismiss="modal">Close</button>
									</div>
								</div>
							</div>
						</div>
						<!-- Modal end -->
					</div>
					<div class="col-sm-6 col-md-3 isotope-item site-building">
						<div class="image-box text-center">
							<div class="overlay-container">
								<img src="images/portfolio-7.jpg" alt="">
								<div class="overlay-top">
									<div class="text">
										<h3><a href="#project-7" data-toggle="modal">Project Title</a></h3>
										<p class="small">Site Building</p>
									</div>
								</div>
								<div class="overlay-bottom">
									<div class="links">
										<a href="#project-7" data-toggle="modal" class="btn btn-gray-transparent btn-animated btn-sm">View Details <i class="pl-10 fa fa-arrow-right"></i></a>
									</div>
								</div>
							</div>
						</div>
						<!-- Modal -->
						<div class="modal fade" id="project-7" tabindex="-1" role="dialog" aria-labelledby="project-7-label" aria-hidden="true">
							<div class="modal-dialog modal-lg">
								<div class="modal-content">
									<div class="modal-header">
										<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
										<h4 class="modal-title" id="project-7-label">Project Title</h4>
									</div>
									<div class="modal-body">
										<div class="row">
											<div class="col-md-6">
												<h3>Project Description</h3>
												<div class="separator-2"></div>
												<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Atque sed, quidem quis praesentium, ut unde. Quae sed, incidunt laudantium nesciunt, optio corporis quod earum pariatur omnis illo saepe numquam suscipit, nemo placeat dignissimos eius mollitia et quas officia doloremque ipsum labore rem deserunt vero! Magnam totam delectus accusantium voluptas et, tempora quos atque, fugiat, obcaecati voluptatibus commodi illo voluptates dolore nemo quo soluta quis.</p>
												<p>Molestiae sed enim laboriosam atque delectus voluptates rerum nostrum sapiente obcaecati molestias quasi optio exercitationem, voluptate quis consequatur libero incidunt, in, quod. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eos nobis officiis, autem earum tenetur quidem. Quae non dicta earum. Ipsum autem eaque cum dolor placeat corporis quisquam dolorum at nesciunt.</p>
											</div>
											<div class="col-md-6">
												<div class="owl-carousel content-slider-with-controls">
													<div class="overlay-container">
														<img src="images/portfolio-1.jpg" alt="">
													</div>
													<div class="overlay-container">
														<img src="images/portfolio-1-2.jpg" alt="">
													</div>
													<div class="overlay-container">
														<img src="images/portfolio-1-3.jpg" alt="">
													</div>
												</div>
											</div>
										</div>
										<div class="row">
											<div class="col-md-6 col-xs-6">
												<h3>Project Info</h3>
												<ul class="list">
													<li><strong class="vertical-divider">Client </strong> John Doe</li>
													<li><strong class="vertical-divider">Date </strong> OCT 2014</li>
													<li><strong class="vertical-divider">In </strong> Web Design</li>
													<li><strong class="vertical-divider">Place </strong> Europe</li>
													<li><strong class="vertical-divider">URL </strong> <a href="#">www.theproject.com</a></li>
												</ul>
											</div>
											<div class="col-md-6 col-xs-12">
												<h3>More info</h3>
												<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor.</p>
												<form role="form">
													<div class="form-group has-feedback">
														<input type="email" class="form-control" id="project-7-email" placeholder="Email">
														<i class="fa fa-envelope-o form-control-feedback"></i>
													</div>
													<a href="#" class="btn btn-default margin-top-clear">Subscribe</a>
												</form>
											</div>
										</div>
									</div>
									<div class="modal-footer">
										<button type="button" class="btn btn-sm btn-default" data-dismiss="modal">Close</button>
									</div>
								</div>
							</div>
						</div>
						<!-- Modal end -->
					</div>
					<div class="col-sm-6 col-md-3 isotope-item app-development">
						<div class="image-box text-center">
							<div class="overlay-container">
								<img src="images/portfolio-8.jpg" alt="">
								<div class="overlay-top">
									<div class="text">
										<h3><a href="#project-8" data-toggle="modal">Project Title</a></h3>
										<p class="small">App Development</p>
									</div>
								</div>
								<div class="overlay-bottom">
									<div class="links">
										<a href="#project-8" data-toggle="modal" class="btn btn-gray-transparent btn-animated btn-sm">View Details <i class="pl-10 fa fa-arrow-right"></i></a>
									</div>
								</div>
							</div>
						</div>
						<!-- Modal -->
						<div class="modal fade" id="project-8" tabindex="-1" role="dialog" aria-labelledby="project-8-label" aria-hidden="true">
							<div class="modal-dialog modal-lg">
								<div class="modal-content">
									<div class="modal-header">
										<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
										<h4 class="modal-title" id="project-8-label">Project Title</h4>
									</div>
									<div class="modal-body">
										<div class="row">
											<div class="col-md-6">
												<h3>Project Description</h3>
												<div class="separator-2"></div>
												<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Atque sed, quidem quis praesentium, ut unde. Quae sed, incidunt laudantium nesciunt, optio corporis quod earum pariatur omnis illo saepe numquam suscipit, nemo placeat dignissimos eius mollitia et quas officia doloremque ipsum labore rem deserunt vero! Magnam totam delectus accusantium voluptas et, tempora quos atque, fugiat, obcaecati voluptatibus commodi illo voluptates dolore nemo quo soluta quis.</p>
												<p>Molestiae sed enim laboriosam atque delectus voluptates rerum nostrum sapiente obcaecati molestias quasi optio exercitationem, voluptate quis consequatur libero incidunt, in, quod. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eos nobis officiis, autem earum tenetur quidem. Quae non dicta earum. Ipsum autem eaque cum dolor placeat corporis quisquam dolorum at nesciunt.</p>
											</div>
											<div class="col-md-6">
												<div class="owl-carousel content-slider-with-controls">
													<div class="overlay-container">
														<img src="images/portfolio-1.jpg" alt="">
													</div>
													<div class="overlay-container">
														<img src="images/portfolio-1-2.jpg" alt="">
													</div>
													<div class="overlay-container">
														<img src="images/portfolio-1-3.jpg" alt="">
													</div>
												</div>
											</div>
										</div>
										<div class="row">
											<div class="col-md-6 col-xs-6">
												<h3>Project Info</h3>
												<ul class="list">
													<li><strong class="vertical-divider">Client </strong> John Doe</li>
													<li><strong class="vertical-divider">Date </strong> OCT 2014</li>
													<li><strong class="vertical-divider">In </strong> Web Design</li>
													<li><strong class="vertical-divider">Place </strong> Europe</li>
													<li><strong class="vertical-divider">URL </strong> <a href="#">www.theproject.com</a></li>
												</ul>
											</div>
											<div class="col-md-6 col-xs-12">
												<h3>More info</h3>
												<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor.</p>
												<form role="form">
													<div class="form-group has-feedback">
														<input type="email" class="form-control" id="project-8-email" placeholder="Email">
														<i class="fa fa-envelope-o form-control-feedback"></i>
													</div>
													<a href="#" class="btn btn-default margin-top-clear">Subscribe</a>
												</form>
											</div>
										</div>
									</div>
									<div class="modal-footer">
										<button type="button" class="btn btn-sm btn-default" data-dismiss="modal">Close</button>
									</div>
								</div>
							</div>
						</div>
						<!-- Modal end -->
					</div>
				</div>
				<div class="owl-carousel content-slider space-top">
					<div class="container">
						<div class="row">
							<div class="col-md-8 col-md-offset-2">
								<div class="testimonial text-center">
									<div class="testimonial-image">
										<img src="images/testimonial-1.jpg" alt="Jane Doe" title="Jane Doe" class="img-circle">
									</div>
									<h3>Just Perfect!</h3>
									<div class="separator"></div>
									<div class="testimonial-body">
										<blockquote>
											<p>Sed ut perspiciatis unde omnis iste natu error sit voluptatem accusan tium dolore laud antium, totam rem dolor sit amet tristique pulvinar, turpis arcu rutrum nunc, ac laoreet turpis augue a justo.</p>
										</blockquote>
										<div class="testimonial-info-1">- Jane Doe</div>
										<div class="testimonial-info-2">By Company</div>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="container">
						<div class="row">
							<div class="col-md-8 col-md-offset-2">
								<div class="testimonial text-center">
									<div class="testimonial-image">
										<img src="images/testimonial-2.jpg" alt="Jane Doe" title="Jane Doe" class="img-circle">
									</div>
									<h3>Amazing!</h3>
									<div class="separator"></div>
									<div class="testimonial-body">
										<blockquote>
											<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Et cupiditate deleniti ratione in. Expedita nemo, quisquam, fuga adipisci omnis ad mollitia libero culpa nostrum est quia eos esse vel!</p>
										</blockquote>
										<div class="testimonial-info-1">- Jane Doe</div>
										<div class="testimonial-info-2">By Company</div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
				<div class="container">
					<div class="clients-container">
						<div class="clients">
							<div class="client-image object-non-visible" data-animation-effect="fadeIn" data-effect-delay="100">
								<a href="#"><img src="images/client-1.png" alt=""></a>
							</div>
							<div class="client-image object-non-visible" data-animation-effect="fadeIn" data-effect-delay="200">
								<a href="#"><img src="images/client-2.png" alt=""></a>
							</div>
							<div class="client-image object-non-visible" data-animation-effect="fadeIn" data-effect-delay="300">
								<a href="#"><img src="images/client-3.png" alt=""></a>
							</div>
							<div class="client-image object-non-visible" data-animation-effect="fadeIn" data-effect-delay="400">
								<a href="#"><img src="images/client-4.png" alt=""></a>
							</div>
							<div class="client-image object-non-visible" data-animation-effect="fadeIn" data-effect-delay="500">
								<a href="#"><img src="images/client-5.png" alt=""></a>
							</div>
							<div class="client-image object-non-visible" data-animation-effect="fadeIn" data-effect-delay="600">
								<a href="#"><img src="images/client-6.png" alt=""></a>
							</div>
							<div class="client-image object-non-visible" data-animation-effect="fadeIn" data-effect-delay="700">
								<a href="#"><img src="images/client-7.png" alt=""></a>
							</div>
							<div class="client-image object-non-visible" data-animation-effect="fadeIn" data-effect-delay="800">
								<a href="#"><img src="images/client-8.png" alt=""></a>
							</div>
						</div>
					</div>
				</div>
			</section>
			<!-- section end -->

			<!-- section start -->
			<!-- ================ -->
			<section class="pv-40 stats padding-bottom-clear dark-translucent-bg hovered background-img-6">
				<div class="clearfix">
					<div class="col-md-3 col-xs-6 text-center">
						<div class="feature-box object-non-visible" data-animation-effect="fadeIn" data-effect-delay="300">
							<span class="icon dark-bg large circle"><i class="fa fa-diamond"></i></span>
							<h3><strong>Projects</strong></h3>
							<span class="counter" data-to="1525" data-speed="5000">0</span>
						</div>
					</div>
					<div class="col-md-3 col-xs-6 text-center">
						<div class="feature-box object-non-visible" data-animation-effect="fadeIn" data-effect-delay="300">
							<span class="icon dark-bg large circle"><i class="fa fa-users"></i></span>
							<h3><strong>Clients</strong></h3>
							<span class="counter" data-to="1225" data-speed="5000">0</span>
						</div>
					</div>
					<div class="col-md-3 col-xs-6 text-center">
						<div class="feature-box object-non-visible" data-animation-effect="fadeIn" data-effect-delay="300">
							<span class="icon dark-bg large circle"><i class="fa fa-cloud-download"></i></span>
							<h3><strong>Downloads</strong></h3>
							<span class="counter" data-to="12235" data-speed="5000">0</span>
						</div>
					</div>
					<div class="col-md-3 col-xs-6 text-center">
						<div class="feature-box object-non-visible" data-animation-effect="fadeIn" data-effect-delay="300">
							<span class="icon dark-bg large circle"><i class="fa fa-share"></i></span>
							<h3><strong>Shares</strong></h3>
							<span class="counter" data-to="15002" data-speed="5000">0</span>
						</div>
					</div>
				</div>
				<!-- footer top start -->
				<!-- ================ -->
				<div class="dark-translucent-bg footer-top animated-text default-hovered" style="background-color:rgba(0,0,0,0.6);">
					<div class="container">
						<div class="row">
							<div class="col-md-12">
								<div class="call-to-action text-center">
									<div class="row">
										<div class="col-sm-8">
											<h2>Powerful Bootstrap Template</h2>
											<h2>Waste no more time</h2>
										</div>
										<div class="col-sm-4">
											<p class="mt-10"><a href="#" class="btn btn-animated btn-lg btn-gray-transparent">Purchase<i class="fa fa-cart-arrow-down pl-20"></i></a></p>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
				<!-- footer top end -->
			</section>
			<!-- section end -->
			<!-- footer start (Add "dark" class to #footer in order to enable dark footer) -->
			<!-- ================ -->
			<footer id="footer" class="clearfix ">

				<!-- .footer start -->
				<!-- ================ -->
				<div class="footer">
					<div class="container">
						<div class="footer-inner">
							<div class="row">
								<div class="col-md-6">
									<div class="footer-content">
										<div class="logo-footer"><img id="logo-footer" src="images/logo_light_blue.png" alt=""></div>
										<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Necessitatibus illo vel dolorum soluta consectetur doloribus sit. Delectus non tenetur odit dicta vitae debitis suscipit doloribus. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sed dolore fugit vitae quia dicta inventore reiciendis. Ipsa, aut voluptas quaerat.</p>
										<ul class="list-inline mb-20">
											<li><i class="text-default fa fa-map-marker pr-5"></i> One infinity loop, 54100</li>
											<li><i class="text-default fa fa-phone pl-10 pr-5"></i> +00 1234567890</li>
											<li><a href="mailto:info@theproject.com" class="link-dark"><i class="text-default fa fa-envelope-o pl-10 pr-5"></i> info@theproject.com</a></li>
										</ul>
										<div class="separator-2"></div>
										<ul class="social-links circle margin-clear animated-effect-1">
											<li class="facebook"><a target="_blank" href="http://www.facebook.com"><i class="fa fa-facebook"></i></a></li>
											<li class="twitter"><a target="_blank" href="http://www.twitter.com"><i class="fa fa-twitter"></i></a></li>
											<li class="googleplus"><a target="_blank" href="http://plus.google.com"><i class="fa fa-google-plus"></i></a></li>
											<li class="linkedin"><a target="_blank" href="http://www.linkedin.com"><i class="fa fa-linkedin"></i></a></li>
											<li class="xing"><a target="_blank" href="http://www.xing.com"><i class="fa fa-xing"></i></a></li>
											<li class="skype"><a target="_blank" href="http://www.skype.com"><i class="fa fa-skype"></i></a></li>
											<li class="youtube"><a target="_blank" href="https://www.youtube.com"><i class="fa fa-youtube"></i></a></li>
											<li class="dribbble"><a target="_blank" href="https://dribbble.com/"><i class="fa fa-dribbble"></i></a></li>
											<li class="pinterest"><a target="_blank" href="http://www.pinterest.com"><i class="fa fa-pinterest"></i></a></li>
											<li class="flickr"><a target="_blank" href="http://www.flickr.com"><i class="fa fa-flickr"></i></a></li>
											<li class="instagram"><a target="_blank" href="http://www.instagram.com"><i class="fa fa-instagram"></i></a></li>
										</ul>
									</div>
								</div>
								<div class="col-md-6">
									<div class="footer-content">
										<h2 class="title">Contact Us</h2>
										<div class="alert alert-success hidden" id="MessageSent2">
											We have received your message, we will contact you very soon.
										</div>
										<div class="alert alert-danger hidden" id="MessageNotSent2">
											Oops! Something went wrong please refresh the page and try again.
										</div>
										<form role="form" id="footer-form" class="margin-clear">
											<div class="form-group has-feedback mb-10">
												<label class="sr-only" for="name2">Name</label>
												<input type="text" class="form-control" id="name2" placeholder="Name" name="name2">
												<i class="fa fa-user form-control-feedback"></i>
											</div>
											<div class="form-group has-feedback mb-10">
												<label class="sr-only" for="email2">Email address</label>
												<input type="email" class="form-control" id="email2" placeholder="Enter email" name="email2">
												<i class="fa fa-envelope form-control-feedback"></i>
											</div>
											<div class="form-group has-feedback mb-10">
												<label class="sr-only" for="message2">Message</label>
												<textarea class="form-control" rows="4" id="message2" placeholder="Message" name="message2"></textarea>
												<i class="fa fa-pencil form-control-feedback"></i>
											</div>
											<input type="submit" value="Send" class="margin-clear submit-button btn btn-default">
										</form>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
				<!-- .footer end -->

				<!-- .subfooter start -->
				<!-- ================ -->
				<div class="subfooter">
					<div class="container">
						<div class="subfooter-inner">
							<div class="row">
								<div class="col-md-12">
									<p class="text-center">Copyright © 2017 The Project by <a target="_blank" href="http://htmlcoder.me">HtmlCoder</a>. All Rights Reserved</p>
								</div>
							</div>
						</div>
					</div>
				</div>
				<!-- .subfooter end -->

			</footer>
			<!-- footer end -->
			
		</div>
		<!-- page-wrapper end -->

		<!-- JavaScript files placed at the end of the document so the pages load faster -->
		<!-- ================================================== -->
		<!-- Jquery and Bootstap core js files -->
		<script type="text/javascript" src="plugins/jquery.min.js"></script>
		<script type="text/javascript" src="bootstrap/js/bootstrap.min.js"></script>
		<!-- Modernizr javascript -->
		<script type="text/javascript" src="plugins/modernizr.js"></script>
		<script type="text/javascript" src="plugins/rs-plugin-5/js/jquery.themepunch.tools.min.js?rev=5.0"></script>
		<script type="text/javascript" src="plugins/rs-plugin-5/js/jquery.themepunch.revolution.min.js?rev=5.0"></script>
		<!-- Isotope javascript -->
		<script type="text/javascript" src="plugins/isotope/isotope.pkgd.min.js"></script>
		<!-- Magnific Popup javascript -->
		<script type="text/javascript" src="plugins/magnific-popup/jquery.magnific-popup.min.js"></script>
		<!-- Appear javascript -->
		<script type="text/javascript" src="plugins/waypoints/jquery.waypoints.min.js"></script>
		<!-- Count To javascript -->
		<script type="text/javascript" src="plugins/jquery.countTo.js"></script>
		<!-- Parallax javascript -->
		<script src="plugins/jquery.parallax-1.1.3.js"></script>
		<!-- Contact form -->
		<script src="plugins/jquery.validate.js"></script>
		<!-- Morphext -->
		<script type="text/javascript" src="plugins/morphext/morphext.min.js"></script>
		<!-- Background Video -->
		<script src="plugins/vide/jquery.vide.js"></script>
		<!-- Owl carousel javascript -->
		<script type="text/javascript" src="plugins/owlcarousel2/owl.carousel.min.js"></script>
		<!-- SmoothScroll javascript -->
		<script type="text/javascript" src="plugins/jquery.browser.js"></script>
		<script type="text/javascript" src="plugins/SmoothScroll.js"></script>
		<!-- Initialization of Plugins -->
		<script type="text/javascript" src="js/template.js"></script>
		<!-- Custom Scripts -->
		<script type="text/javascript" src="js/custom.js"></script>

	</body>
</html>
